<template>
    <div class="app-container">
      <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleTabClick">
        <el-tab-pane label="荣誉墙" name="first">
          <honor-wall ref="honorWallRef"></honor-wall>
        </el-tab-pane>
      </el-tabs>
    </div>
  </template>
  
  <script setup name="Honor">
  import HonorWall from './component/HonorWall.vue'
  const activeName = ref('first');
  const honorWallRef = ref(null);
  const orgRewardsRef = ref(null);
  const singleRewardsRef = ref(null);
  function handleTabClick(tab) {
    activeName.value = tab.props.name;
    if (activeName.value === 'first') {
      honorWallRef.value.refresh();
    } else if (activeName.value ==='second') {
      orgRewardsRef.value.refresh();
    } else if (activeName.value === 'third') {
      singleRewardsRef.value.refresh();
    }
  }
  </script>
  <style lang="scss" scoped>
  .el-tabs__content {
    height: 100% !important;
  }
  </style>